<template>
  <div>
    <button class="wad"
      @click="jumpHomeFN">跳转到home页面</button>
    <button class="wad"
      @click="jumpAboutFN">跳转到about页面</button>
    <button class="wad"
      @click="justResizeBoxFn">跳转到ResizeBox页面</button>
    <button class="wad"
      @click="justgridLayoutFn">跳转到gridLayout页面</button>
    <button class="wad"
      @click="just3DFn">跳转到三维页面</button>
    <router-view></router-view>
  </div>
</template>
<script setup>
import { ref } from "vue"
import { useRoute, useRouter } from "vue-router"
import { getSettingDataApi } from '@/api/index.js'

import * as echarts from 'echarts'
const route = useRoute()
const router = useRouter()
const sateId = ref(6010)

const jumpAboutFN = () => {
  router.push('/about')
}
const jumpHomeFN = () => {
  router.push('/home')
}
const justResizeBoxFn = () => {
  router.push('/Resize')
}

const justgridLayoutFn = () => {
  router.push('/gridLayout')
}
const just3DFn = () => {
  router.push('/3dPage')
}
</script>
<style scoped>
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html,
body,
#app {
  margin: 0;
  padding: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
}
</style>

<style>
@import "vue-draggable-resizable/style.css";
</style>
